<template>
    <div >
        <comment-content :comment="comment" v-on:change="changCommmer"></comment-content>
        <comment-textarea :type="type" v-show="Show":name="oldComment" :headimg="headimg" v-on:submit="addComment" v-on:canel="canelCommit" ></comment-textarea>
    </div>
</template>
<script>
import CommentContent from 'base/comment/commentContent'
import CommentTextarea from 'base/comment/commentTextArea'
import {getTime} from 'common/js/dom'
export default {
  props: ['comments', 'isShow'],
  data () {
    return {
      commenter: 'session',
      type: 0,
      oldComment: '',
      headimg: '',
      chosedIndex: -1,
      comment: this.comments,
      Show: this.isShow
    }
  },
  methods: {
    addComment (data) {
      if (this.type === 0) {
        this.comment.push({
          user_name: 'session',
          create_time: getTime(),
          comment: data
        })
      } else if (this.type === 1) {
        this.comment.push({
          user_name: 'session',
          to_nickname: this.oldComment,
          create_time: getTime(),
          comment: data,
          to_header_image: this.headimg,
          type: 2
        })
        this.type = 0
      }
    },
    changCommmer (name, index, headimg) {
      this.oldComment = name
      this.chosedIndex = index
      this.headimg = headimg
      this.type = 1
    },
    canelCommit () {
      this.type = 0
    }
  },
  components: {
    CommentContent,
    CommentTextarea
  }
}
</script>

<style lang="stylus" rel="stylesheet/stylus" ></style>
